{% extends "layout/product-section.html" %}
{% set active_page = "overview" %}

{% set have_data = selected_summary and selected_summary.dataset_count > 0 %}
{% set have_displayable_data = selected_summary and selected_summary.footprint_count > 0 %}
{% set dataset_limit = 500 %}
{% set show_individual_datasets = have_data and selected_summary.dataset_count < dataset_limit %}

{% block content %}
    {% from "layout/macros.html" import query_param_list, show_raw_document %}

    <div class="panels">
        <div class="map-panel relative">
            {% if not selected_summary.footprint_count %}
                <div id="msg-no-results" class="message-box">
                    {% if selected_summary %}
                        <span>
                        No {% if selected_summary.dataset_count %}displayable{% endif %}
                            datasets for period</span>
                    {% else %}
                        <span>No data: not yet generated</span>
                    {% endif %}
                </div>
            {% endif %}
            <div id="map"></div>
        </div>
        {% if product %}
            <div>
                <div class="panel highlight product-description">
                    {{ product.definition.description }}
                </div>
                <div class="panel info-panel">

                    {% if have_displayable_data %}
                        <div>
                            {# Show regions if available, otherwise a plain footprint #}
                            {% if product_region_info %}
                                <label>
                                    <input type="radio"
                                           name="map_display_view"
                                           value="regions"
                                           {% if regions_geojson %}checked="checked"{% endif %}
                                           title="Show regions">{{ product_region_info.units_label }}</label>
                            {% else %}
                                <label>
                                    <input type="radio"
                                           name="map_display_view"
                                           value="footprint"
                                           {% if footprint_geojson %}checked="checked"{% endif %}
                                           title="Show footprint">Footprint</label>
                            {% endif %}
                            <label class="{% if not show_individual_datasets %}disabled{% endif %}"
                                   {% if not show_individual_datasets %}title="Too many datasets to display individually"{% endif %}>
                            <input type="radio"
                                   name="map_display_view"
                                   value="datasets"
                                   {% if not show_individual_datasets %}disabled="disabled"{% endif %}
                                   title="Show individual datasets">Datasets</label>
                        </div>
                    {% endif %}

                    <h1><strong>{{ product.name }}</strong>{{ product_args_label }}</h1>

                    {% if selected_summary.newest_dataset_creation_time %}
                        <div class="last-processed muted">
                            Last processed {{ selected_summary.newest_dataset_creation_time | timesince }}
                        </div>
                    {% endif %}

                    <a href="{{ url_for('search_page', **product_args) }}" class="muted dataset-count"
                    >{{ '{:,d}'.format(selected_summary.dataset_count) if selected_summary else 'Unknown number of' }}
                        dataset{% if selected_summary.dataset_count != 1 %}s{% endif %}
                    </a>

                    {% if selected_summary.dataset_count != selected_summary.footprint_count %}
                        ({{ selected_summary.footprint_count or 'None' }} displayable)
                    {% endif %}

                    <ul>
                        {% if selected_summary.size_bytes %}
                            <li><span
                                    class="coverage-filesize">{{ selected_summary.size_bytes | printable_data_size }}</span>
                            </li>
                        {% endif %}

                        {% if selected_summary.footprint_geometry %}
                            <li>
                                <span class="coverage-footprint-area">{{ selected_summary.footprint_geometry | albers_area }} (approx.)</span>
                            </li>
                        {% endif %}
                        {% if product_region_info %}
                            <li>
                        <span class="coverage-region-count" title="{{ product_region_info.description }}">
                            {{ (selected_summary.region_dataset_counts or []) | length }} unique {{ product_region_info.units_label }}
                        </span>
                            </li>
                        {% else %}
                            <li>
                        <span class="coverage-region-missing"
                              title="Product has neither a grid specification, nor platform-specific regions (eg. Landsat WRS path rows)">
                            No configured regions
                            <!-- User can hover to see slightly longer explanation -->
                            <i class="fa fa-info-circle"></i>
                        </span>
                            </li>
                        {% endif %}
                        {% if selected_summary.crses %}
                            <li class="coverage-crs-count"
                                title="Datasets contain: {{ selected_summary.crses | join(', ') }}">
                                {% if selected_summary.crses | length == 1 %}
                                    {% if None in selected_summary.crses %}
                                        No CRSes defined
                                    {% else %}
                                        Entirely {{ selected_summary.crses|join(',') }}
                                    {% endif %}
                                {% else %}
                                    {{ selected_summary.crses | length }} CRS
                                    <!-- User can hover to see list of CRSes in title text -->
                                    <i class="fa fa-info-circle"></i>
                                {% endif %}
                            </li>
                        {% endif %}

                    </ul>

                    {% if product_summary.source_products %}
                        <h4>Sources</h4>
                        <ul>
                            {% for product_name in product_summary.source_products %}
                                <li class="source-product">
                                    <i class="fa fa-level-up fa-flip-horizontal" aria-hidden="true"></i>

                                    <a href="{{ url_for(request.url_rule.endpoint, product_name=product_name, year=year, month=month, day=day) }}">
                                        {{ product_name }}
                                    </a>
                                </li>
                            {% endfor %}
                        </ul>
                    {% endif %}

                    <h4>
                        <a href="{{ url_for('product.metadata_type_page', name=product.metadata_type.name) }}">
                            {{ product.metadata_type.name }}</a>
                        fields
                    </h4>

                    {{ query_param_list(product.fields, descriptions=product.metadata_type.dataset_fields) }}


                    {% if product.definition.measurements %}
                        <h4>Measurements</h4>
                        <ul>
                            {% for measurement in product.definition.measurements %}
                                <li>
                                    <div>
                                        <span>{{ measurement.name }}</span>
                                        {%- for a in measurement.aliases %}
                                            / <span class="muted">{{ a }}</span>
                                        {%- endfor %}
                                    </div>
                                    {#                            <div>#}
                                    {#                                type {{ measurement.dtype }};#}
                                    {#                                units {{ measurement.units }};#}
                                    {#                                nodata {{ measurement.nodata }}#}
                                    {#                            </div>#}
                                </li>
                            {% endfor %}
                        </ul>
                    {% endif %}

                    {# These fields are enforced by dataset-type-schema.yaml #}
                    {#            {% if product.definition.storage %}#}
                    {#                <h4>Storage</h4>#}
                    {#                {{ query_param_list(product.definition.storage, show_dicts=true) }}#}
                    {#            {% endif %}#}


                    {% if product_summary.derived_products %}
                        <h4>Derived</h4>
                        <ul>
                            {% for product_name in product_summary.derived_products %}
                                <li class="derived-product">
                                    <i class="fa fa-level-down" aria-hidden="true"></i>
                                    <a href="{{ url_for(request.url_rule.endpoint, product_name=product_name, year=year, month=month, day=day) }}">
                                        {{ product_name }}
                                    </a>
                                </li>
                            {% endfor %}
                        </ul>
                    {% endif %}

                    <p>
                        <a href="{{ url_for('product.product_page', name=product.name) }}"
                           class="muted">raw metadata</a>
                    </p>

                    {# Mostly useful for debugging: hide in page source code. Users should look at page footer instead. #}
                    {% if selected_summary.newest_dataset_creation_time %}
                        <!-- Summarised {{ selected_summary.summary_gen_time | timesince }} -->
                    {% endif %}
                </div>

            </div>
        {% endif %}
    </div>
{% endblock %}


{% block body_footer %}

    {{ super() }}

    {% from "layout/macros.html" import chart_timeline %}
    <script src="{{ url_for('static', filename='overview.js') }}"></script>
    <script type="application/javascript">
        (function () {
            'use strict';
            const footprintGeoJSON = {{ footprint_geojson | torapidjson }},
                  regionsGeoJSON = {{ regions_geojson | torapidjson }};

            const routes = new ApplicationRoutes(
                '{{ url_for('region_page', region_code='__REGION_CODE__', **product_args)}}',
                '{{ url_for('region_page', region_code='__REGION_CODE__', feelinglucky=True, **product_args) }}',
                '{{ url_for('dataset.dataset_page', id_='__DATASET_ID__') }}',
                '{{ url_for('api.regions_geojson', **product_args) }}',
                '{{ url_for('api.datasets_geojson', limit=dataset_limit, **product_args)}}',
                '{{ url_for('api.footprint_geojson', **product_args) }}'
            );
            const map = initPage(
                {% if footprint_geojson %}true{% else %}false{% endif %},
                {% if show_individual_datasets %}true{% else %}false{% endif %},
                routes,
                regionsGeoJSON,
                footprintGeoJSON
            );

            {% if selected_summary.timeline_dataset_counts and (selected_summary.timeline_dataset_counts | length > 1) %}
                const timelineControl = L.control({position: "topright"});
                timelineControl.onAdd = function (map) {
                    const div = L.DomUtil.create("div", "timeline-control");
                    div.innerHTML = {{
                        chart_timeline(
                            selected_summary.timeline_dataset_counts,
                            product,
                            period=selected_summary.timeline_period
                        ) | torapidjson
                        }};
                    return div;
                };
                map.addControl(timelineControl);
            {% endif %}

            window.MAP = map;
        })();
    </script>
{% endblock %}
